<template>

	<div>
		<div @click.stop="$parent.$parent.onEditer(index)" class="drag optional" :class="{ selected: index === selectedIndex }">
			<div
				class="diy-guide"
				:style="{
					padding: item.style.paddingTop + 'px ' + item.style.paddingLeft + 'px ' + item.style.paddingBottom + 'px ' + item.style.paddingLeft + 'px',
					background: item.style.background
				}"
			>
				<p class="line" :style="{ borderTopWidth: item.style.lineHeight + 'px', borderTopColor: item.style.lineColor, borderTopStyle: item.style.lineStyle }"></p>
			</div>
		</div>
	</div>
</template>

<script>
export default {
	data() {
		return {};
	},
	props: ['item', 'index', 'selectedIndex'],
	methods: {}
};
</script>

<style lang="scss" scoped></style>
